import {h, init, styleModule, eventListenersModule} from "snabbdom"
/* snabbdom核心代码不能处理属性/事件/样式，如果需要处理，可以使用模块
常用模块：
attributes
  设置dom元素的属性，使用setAttribute()
props
  和attributes模块蕾丝，设置dom元素属性element[attr] = value;
class
  切换类样式，通过sel选择器给元素设置类样式
dataset
  设置data-*自定义属性
eventlisteners
  注册和移除事件
style
  设置行内样式，支持动画
使用模块步骤：
1.导入需要的模块
2.init中注册模块
3.使用h函数创建vnode时，可以把第二个参数设置为模块对象，其他参数后移
 */
// 注册模块
let patch = init([styleModule, eventListenersModule])
let vnode = h("div.container", {
    style:{
        color:"blue",
        backgroundColor:"#e1e1e1",
        padding: "10px"
    },
    on:{
        click:clickHandler
    }
},[
    h("h1", "这是使用模块创建的vnode"),
    h("p", "使用了style和eventlistener模块")
])
function clickHandler(){
    console.log("clickHandler");
}
let app = document.querySelector("#app");
patch(app, vnode)